<!--
 * @Author: wangshuixin 2412658453@qq.com
 * @Date: 2025-05-17 23:55:19
 * @LastEditors: wangshuixin 2412658453@qq.com
 * @LastEditTime: 2025-06-09 00:49:39
 * @FilePath: /my-app/src/pages/components/WordExportButton/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <button @click="handleExport" :disabled="isExporting">
    <slot>
      {{ isExporting ? '导出中...' : '导出Word' }}
    </slot>
  </button>
</template>

<script setup>
import { ref } from 'vue';
import { WordExporter } from '@/utils/WordExporter';
// #ifdef H5
import { saveAs } from 'file-saver';
// #endif

const props = defineProps({
  // 可以传入配置对象
  config: {
    type: Object,
    default: () => ({})
  },
  // 或者传入生成函数
  generator: {
    type: Function,
    default: null
  },
  // 默认文件名
  filename: {
    type: String,
    default: 'document.docx'
  }
}); 

const emit = defineEmits(['success', 'error']);

const isExporting = ref(false);

// 导出Word
const handleExport = async () => {
  isExporting.value = true;
  try {
    const exporter = new WordExporter();
    
    // 如果有生成函数，使用生成函数
    if (props.generator) {
      await props.generator(exporter);
    } 
    // 否则使用配置对象
    else {
      console.error('导出失败，未传入生成函数');
      return;
    }
    
    // 生成文档
    const data = await exporter.generate();

    // #ifdef MP-WEIXIN
      const fs = wx.getFileSystemManager(); // 小程序文件系统
      const filePath = `${wx.env.USER_DATA_PATH}/${props.filename}`;

      // 关键修改：确保数据是ArrayBuffer
      const arrayBuffer = data instanceof Uint8Array ? data.buffer : data;
      fs.writeFile({
        filePath,
        data: arrayBuffer, // 必须是 ArrayBuffer
        encoding: 'binary', // 二进制模式
        success() {
          console.log('文件保存成功:', filePath);
          wx.openDocument({
            filePath,
            fileType: 'docx', // 如果是 Word 文档
          });
        },
        fail(err) {
          console.error('保存失败:', err);
        },
      });
    // #endif

    // #ifdef H5
      saveAs(new Blob([data]), props.filename);
      emit('success');
    // #endif
  } catch (error) {
    console.error('导出Word失败:', error);
    emit('error', error);
  } finally {
    isExporting.value = false;
  }
};
</script>

<style scoped>
button {
  padding: 8px 16px;
  background-color: #2c3e50;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

button:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
}
</style>